<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<title>登录</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" type="text/css" href="{{$__STATIC__}}/login/default/fonts/font-awesome-4.7.0/css/font-awesome.min.css?v={{$static_version}}">
	<link rel="stylesheet" type="text/css" href="{{$__STATIC__}}/login/default/fonts/iconic/css/material-design-iconic-font.min.css?v={{$static_version}}">
	<link rel="stylesheet" type="text/css" href="{{$__STATIC__}}/login/default/css/util.css?v={{$static_version}}">
	<link rel="stylesheet" type="text/css" href="{{$__STATIC__}}/login/default/css/main.css?v={{$static_version}}">
    <script src="{{$__COMMON__}}/js/jquery-3.2.1.min.js?v={{$static_version}}"></script>
    <script src="{{$__STATIC__}}/lib/layui/layui.js?v={{$static_version}}"></script>
    <script src="{{$__STATIC__}}/js/common.js?v={{$static_version}}"></script>
    <link rel="shortcut icon" href="/favicon.ico"/>
</head>
<body>
<style>
	img {
		vertical-align: middle;
		border-style: none;
	}
	a{
		text-decoration: none;
	}
</style>

	<div class="limiter">
		<div class="container-login100" style="background-image: url('{{$__STATIC__}}/images/bg-01.jpg');">
			<div class="wrap-login100 p-l-55 p-r-55 p-t-65 p-b-54">
				<form class="login100-form validate-form">
					<span class="login100-form-title p-b-49">登录</span>

					<div class="wrap-input100 validate-input m-b-23" data-validate="请输入用户名">
						<span class="label-input100">用户名</span>
						<input class="input100" type="text" id="username" maxlength="16" placeholder="请输入用户名" autocomplete="off">
						<span class="focus-input100" data-symbol="&#xf206;"></span>
					</div>

					<div class="wrap-input100 validate-input" data-validate="请输入密码">
						<span class="label-input100">密码</span>
						<input class="input100" type="password" id="password" maxlength="16" placeholder="请输入密码">
						<span class="focus-input100" data-symbol="&#xf190;"></span>
					</div>
					<div>
						<div class="wrap-input100 validate-input" data-validate="请输入验证码" style="width: 48%;display: inline-block;">
							<span class="label-input100">验证码</span>
							<input class="input100" type="text" id="code" maxlength="4" placeholder="请输入验证码" >

							<span class="focus-input100" data-symbol="&#xf190;"></span>

						</div>
						<img src="{{:url('manage/captcha')}}" id="codeImg" onclick="Pages.changeCode(this);"  style="width:145px;height: 55px;display: inline-block;cursor: pointer; " />
					</div>

					<div class="text-right p-t-8 p-b-31">

					</div>

					<div class="container-login100-form-btn">
						<div class="wrap-login100-form-btn">
							<div class="login100-form-bgbtn"></div>
							<button class="login100-form-btn" type="button" onclick="Pages.submit();">登 录</button>
						</div>
					</div>

				</form>
			</div>
		</div>
	</div>
</body>
<script>
	if (top.location != self.location){
		top.location = self.location;
	}
	document.onkeydown = function (event) {
		var event = event || window.event;
		if (event.keyCode == '13') {
			Pages.submit();
		}
	};

	var layer;
	layui.use(['layer'],function(){
		layer=layui.layer;
	});
	var Pages={
		canOperate:true,
		changeCode:function(obj){
			$(obj).attr('src','{{:url("manage/captcha")}}?'+Math.random());
		},
		submit:function(){
			if(!Pages.canOperate){
				return false;
			}
			var username = $("#username").val();
			var password = $("#password").val();
			var code = $("#code").val();

			var param = {
				username:username,
				password:password,
				captcha_code:code
			};
			var url = VK.U('login');
			Pages.canOperate = false;
			var loading = VK.load();
			VK.QAjax(url,'POST',param,function(res){
				if(res.status!= 200){
					VK.closeLoad(loading);
					VK.error(res.msg);
					Pages.canOperate = true;
					return false;
				}
				VK.success('登录成功');
				window.location.href=VK.U('');

			},function(){
				VK.error('网络异常，请稍后重试');
				Pages.canOperate = true;
				Pages.changeCode();
				VK.closeLoad(loading);
			});
		}
	}
</script>

</html>
